﻿<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-016.js" type="text/javascript"></script>
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-017.js" type="text/javascript"></script>
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-018.js" type="text/javascript"></script>
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/featured-post/n17-content-slider/n17-content-slider-019.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[

$(document).ready(function(){
	$(".glidecontent").hover(function() {
		$(this).children(".glidemeta").animate({opacity: "show"}, "slow");
	}, function() {
		$(this).children(".glidemeta").animate({opacity: "hide"}, "fast");
	});
});

//]]>
</script>
<script type="text/javascript">
//<![CDATA[

$(document).ready(function() {
	$('#tabzine> ul').tabs({ fx: { height: 'toggle', opacity: 'toggle' } });

});

//]]>
</script>
<script type="text/javascript">
	jQuery(function(){
			jQuery('ul.sf-menu').superfish();
		});
</script>
<script type="text/javascript">
featuredcontentglider.init({
	gliderid: "glidercontent",
	contentclass: "glidecontent",
	togglerid: "togglebox",
	remotecontent: "", 
	selected: 1,
	persiststate: true,
	speed: 300,
	direction: "leftright", 
	autorotate: true, 
	autorotateconfig: [10000, 1] //if auto rotate enabled, set [milliseconds_btw_rotations, cycles_before_stopping]
})
</script>
<script type="text/javascript">
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script>
<a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a>
<style type="text/css">
#glidercontent{
margin:0px 0 5px 0px;
font-family:Georgia,Century gothic, Arial,Tahoma,sans-serif;
}
.glidecontentwrapper{
position: relative; /* Do not change this value */
width: 670px;
height: 300px; /* Set height to be able to contain height of largest content shown*/
overflow: hidden;
margin:0px 0px 0px 0px;
background:url(http://3.bp.blogspot.com/_4HKUHirY_2U/SwTsGH40-_I/AAAAAAAAAP0/aNRCgjPZauI/tgb.jpg) repeat-y;
}
.glidecontent{ /*style for each glide content DIV within wrapper.*/
position:absolute; /* Do not change this value */
padding:0px 10px 0px 10px;
width:640px;
color:#fff;
margin:0px 0px;
height: 230px;
background:#ec03d9 url() no -repeat;
overflow:hidden;
float:left;
}
.glidemeta h2{
margin:5px 0px 5px 0px;
padding:5px 0px;
font-size:18px;
font-weight:bold;
}
.glidemeta h2 a:link, .glidemeta h2 a:visited{
color:#fff;
}
.glidemeta{
height: 80px;
width: 650px;
padding:0px 5px 5px 5px;
position:absolute;
background: url(http://4.bp.blogspot.com/_4HKUHirY_2U/SwTYvAM5wFI/AAAAAAAAAO0/MNHdbvpz-0g/balloon.png);
top:164px;
line-height:14px;
color: #fff;
font-size:12px;
overflow: hidden;
display:none;
border-top:1px solid #000;
}
.gnav{ /*style for DIV used to contain toggler links. */
width: 100px;
height:50px;
z-index:150;
float:right;
padding-right:25px;
}
.glidecontenttoggler{ /*style for DIV used to contain toggler links. */
height:38px;
z-index:150;
width: 670px;
background: url(http://4.bp.blogspot.com/_4HKUHirY_2U/SwTr9OFB_bI/AAAAAAAAAPc/u_L6n3MsL7w/gtop.jpg);
}
.glidecontenttoggler a{ /*style for every navigational link within toggler */
display: -moz-inline-box;
display: inline-block;
color: #2e6ab1;
font-weight: bold;
text-decoration: none;
}
.glidecontenttoggler a.selected{ /*style for selected page's toggler link. ".selected" class auto generated! */
background: #E4EFFA;
color: black;
}
.glidecontenttoggler a:hover{
background: #E4EFFA;
color: black;
}
.glidecontenttoggler a.toc{ /*style for individual toggler links (page 1, page 2, etc). ".toc" class auto generated! */
}
.glidecontenttoggler a.prev{ /*style for "prev" and "next" toggler links. ".prev" and ".next" classes auto generated! */
top:6px;
right:35px;
position:absolute;
display:block;
background:url(http://2.bp.blogspot.com/_4HKUHirY_2U/SwTsAadil-I/AAAAAAAAAPk/N-y2th8_LVc/left.jpg) bottom;
width:36px;
height:25px;
}
.glidecontenttoggler a.next {
float:right;
display:block;
background:url(http://2.bp.blogspot.com/_4HKUHirY_2U/SwTsDYsmbBI/AAAAAAAAAPs/-lVdze7mg_c/right.jpg) bottom;
width:36px;
height:25px;
position:absolute;
top:6px;
right:5px;
}
</style>




<h3>» How To Add jQuery Featured Content Slider to Blogger </h3>







<div id="glidercontent" class="glidecontentwrapper">
<div id="togglebox" class="glidecontenttoggler">
<a class="prev" href="#"></a>
<a class="next" href="#"></a>
</div>


<div class="glidecontent">
<div class="glidemeta">
<h2><a href="http://24work.blogspot.com/2012/01/how-to-change-mouse-cursor-in-blogger.html" target="_blank" title="http://24work.blogspot.com/2012/01/how-to-change-mouse-cursor-in-blogger.html" target="_blank">How to change mouse cursor in blogger blog to animated cursors</a></h2>
How to change mouse cursor in blogger blog to animated cursors.One of the best way to add extra fun to your ....<a href="#">read more</a></div>
<a href="http://24work.blogspot.com/2012/01/how-to-change-mouse-cursor-in-blogger.html" target="_blank" title="http://24work.blogspot.com/2012/01/how-to-change-mouse-cursor-in-blogger.html" target="_blank">
<img alt="How to change mouse cursor in blogger blog to animated cursors" width="650" src="http://4.bp.blogspot.com/-_imIUY4NJSE/Uh8WOO0iEJI/AAAAAAAABMk/OSd0cECdtaw/s1600/How+to+change+mouse+cursor+in+blogger+blog+to+animated+cursors.png" height="250"/></a>
</div>

<div class="glidecontent">
<div class="glidemeta">
<h2><a href="http://24work.blogspot.com/2012/01/numbered-page-navigation-for-blogger.html" target="_blank" title="http://24work.blogspot.com/2012/01/numbered-page-navigation-for-blogger.html" target="_blank">Numbered Page Navigation For Blogger New Script</a></h2>
Today we will see how to add a nice page number navigation hack blogger. The default navigation links (i.e Older Posts) is not the friendly visitor</div>
<a href="http://24work.blogspot.com/2012/01/numbered-page-navigation-for-blogger.html" target="_blank" title="http://24work.blogspot.com/2012/01/numbered-page-navigation-for-blogger.html" target="_blank">
<img alt="Numbered Page Navigation For Blogger New Script" width="650" src="http://2.bp.blogspot.com/-Atai5vc1XbY/Uh8Zmk-W8iI/AAAAAAAABMw/cdSZcLja2HA/s1600/Numbered+Page+Navigation+For+Blogger+New+Script.png" height="250"/></a>
</div>

<div class="glidecontent">
<div class="glidemeta">
<h2><a href="http://24work.blogspot.com/2011/12/how-to-add-snow-effect-on-blogger-mouse.html" target="_blank" title="http://24work.blogspot.com/2011/12/how-to-add-snow-effect-on-blogger-mouse.html" target="_blank">How To Add Snow Effect On The Blogger Mouse Cursor Area</a></h2>
How to change mouse cursor in blogger blog to animated cursors.One of the best way to add extra fun to your blog is, changing mouse cursor on your blog.</div>
<a href="http://24work.blogspot.com/2011/12/how-to-add-snow-effect-on-blogger-mouse.html" target="_blank" title="http://24work.blogspot.com/2011/12/how-to-add-snow-effect-on-blogger-mouse.html" target="_blank">
<img alt="How To Add Snow Effect On The Blogger Mouse Cursor Area" width="650" src="http://2.bp.blogspot.com/-TB0nYXupIQQ/Uh9-YRcL9OI/AAAAAAAABNE/3SvNSo6cptw/s1600/How+To+Add+Snow+Effect+On+The+Blogger+Mouse+Cursor+Area.png" height="250"/></a>
</div>

<div class="glidecontent">
<div class="glidemeta">
<h2><a href="http://24work.blogspot.com/2012/01/falling-objects-falling-text-marquee.html" target="_blank" title="http://24work.blogspot.com/2012/01/falling-objects-falling-text-marquee.html" target="_blank">Falling Objects / Falling Text / Marquee Scrolling Text Generator for Blogger</a></h2>
You can show the falling objects or graphics to your Blogger profile page. This generator falling objects to specify an image of your choice.</div>
<a href="http://24work.blogspot.com/2012/01/falling-objects-falling-text-marquee.html" target="_blank" title="http://24work.blogspot.com/2012/01/falling-objects-falling-text-marquee.html" target="_blank">
<img alt="Falling Objects / Falling Text / Marquee Scrolling Text Generator for Blogger" width="650" src="http://1.bp.blogspot.com/-oPHU7KVi9KY/Uh9-YDYqfaI/AAAAAAAABNA/2FBfF9W_uww/s1600/Falling+Objects++Falling+Text++Marquee+Scrolling+Text+Generator+for+Blogger.png" height="250"/></a>
</div>

<div class="glidecontent">
<div class="glidemeta">
<h2><a href="http://24work.blogspot.com/2011/12/how-to-add-animated-flash-clock-to-your.html" target="_blank" title="http://24work.blogspot.com/2011/12/how-to-add-animated-flash-clock-to-your.html" target="_blank">How To Add Animated Flash Clock To Your Blogger Blog</a></h2>
Hello! `How are you guys? here's the cool Clock.this tutorial will show you how to Add animated flash clock gadget your Blogger blog.</div>
<a href="http://24work.blogspot.com/2011/12/how-to-add-animated-flash-clock-to-your.html" target="_blank" title="http://24work.blogspot.com/2011/12/how-to-add-animated-flash-clock-to-your.html" target="_blank">
<img alt="How To Add Animated Flash Clock To Your Blogger Blog" width="650" src="http://2.bp.blogspot.com/-Jofft89_rJ8/Uh9_xDFV-4I/AAAAAAAABNk/-yBhYsrGEoE/s1600/How+To+Add+Animated+Flash+Clock+To+Your+Blogger+Blog.png" height="250"/></a>
</div>

</div>
</div>
<div class="clear"></div>